<template>
	<view class="card-box u-flex">
    <view class="card-item u-flex-col " @tap="jump('/pages/message')">
      <view class="u-flex-col item-box u-col-center">
        <image class="card-img" :src="$IMG_URL + '/imgs/user/tab55.png'" mode=""></image>
        <text class="item-title">消息通知</text>
      </view>
    </view>
    <view class="card-item u-flex-col " @tap="jump('/pages/students')">
      <view class="u-flex-col item-box u-col-center">
        <image class="card-img" :src="$IMG_URL + '/imgs/user/tab55.png'" mode=""></image>
        <text class="item-title">关注学生</text>
      </view>
    </view>
    <view class="card-item u-flex-col " @tap="jump('/pages/setting')">
      <view class="u-flex-col item-box u-col-center">
        <image class="card-img" :src="$IMG_URL + '/imgs/user/tab55.png'" mode=""></image>
        <text class="item-title">通用设置</text>
      </view>
    </view>
  </view>
</template>

<script>
import { mapMutations, mapActions, mapState, mapGetters } from 'vuex';
export default {
	methods: {
		jump(path, query) {
			this.$Router.push({
				path: path,
				query: query
			});
		}
	}
};
</script>

<style lang="scss">
.card-box {
  margin: 16rpx;
  justify-content: space-between;
  
	.card-item {
    padding: 26rpx;
    width: 230rpx;
    background: #fff;
    
		.item-box {
			position: relative;
		}
    
		.card-img {
			width: 100rpx;
			height: 100rpx;
		}

		.item-title {
			font-size: 34rpx;
			font-weight: 500;
			color: #999999;
			line-height: 48rpx;
		}
	}
}
</style>
